<template>
  <div class="home-container">
    <div class="header-container">
      <Header></Header>
    </div>
    <div class="body-container">
      <router-view></router-view>
    </div>
  </div>
</template>

<script>
// @ is an alias to /src
import Header from "./Header";
export default {
  name: "Home",
  components: { Header },
};
</script>
<style>
.home-container {
  height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.header-container {
  height: 5rem;
  width: 100%;
  background-color: rgb(179, 38, 38);
}
.body-container {
  width: 100%;
  flex: 1;
  background-color: rgb(38, 179, 148);
}
</style>
